<template>
  <div>
    <el-dialog
    title="调整实付核价单"
    :visible.sync="dialogVisible"
    width="70%"
    :before-close="handleClose"
    ref="nucleardialog"
  >
    <div class="WorkingSchedule" v-loading="loading">
      <el-table :data="tableData" style="width: 100%" border size="mini">
        <el-table-column label width="35">
          <template slot-scope="{ row }">
            <el-radio
              :label="row.pricing_number"
              v-model="editForm.pay_pricing_number"
              >&nbsp;</el-radio
            >
          </template>
        </el-table-column>
        <el-table-column
          label="核价单编码"
          align="center"
          prop="pricing_number"
        ></el-table-column>
        <el-table-column
          label="款号"
          align="center"
          prop="type_no"
        ></el-table-column>
        <el-table-column
          label="核价用途"
          align="center"
          prop="valuation_purpose"
        ></el-table-column>
        <el-table-column
          label="创建时间"
          align="center"
          prop="createtime"
        ></el-table-column>

        <el-table-column label="状态" align="center" prop="s_status">
          <template slot-scope="{ row }">
            <div
              :style="{
                color:
                  row.s_status == 0
                    ? '#67C23A'
                    : row.s_status == 1
                    ? 'red'
                    : '',
              }"
            >
              {{ row.s_status == 0 ? "正常" : row.s_status == 1 ? "锁定" : "" }}
            </div>
          </template>
        </el-table-column>
        <el-table-column
          label="加工厂价格"
          align="center"
          prop="garment_cost_plus_total"
        ></el-table-column>
        <el-table-column
          label="绣花厂价格"
          align="center"
          prop="embroider_cost_plus_total"
        ></el-table-column>
        <el-table-column
          label="总价"
          align="center"
          prop="cost_plus_total"
        ></el-table-column>
        <el-table-column
          label="核价单备注"
          align="center"
          prop="comment"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <!-- <el-table-column label="调整原因" align="center" prop="reason" :show-overflow-tooltip="true"></el-table-column> -->
        <!-- <el-table-column label="操作" align="center">
          <template slot-scope="{ row }">
            <el-button type="text" @click="onEdit(row.pricing_number)">选中</el-button>
          </template>
        </el-table-column>-->
      </el-table>
      <pagination
        :form="form"
        :total="total"
        @paginationPostOrderTaskList="postAdminPricingGetPricingGetPricingOrder"
      />
      <div style="margin-top: 30px">
        <div style="font-size: 18px; margin-bottom: 10px">调整原因</div>
        <el-input
          type="textarea"
          :rows="2"
          placeholder="格式：物料名称+单位+部位+原价+现价+原因"
          v-model="editForm.reason"
        ></el-input>
      </div>
      <div style="margin-top: 10px">
        <el-upload
          action="https://ssy.13yu.com/index.php/Admin/Api/upload"
          :on-success="handleSuccessXJ"
          :before-remove="handleRemovesXJ"
          list-type="picture-card"
          :file-list="editForm.images"
        >
          <i slot="default" class="el-icon-plus"></i>
          <div slot="file" slot-scope="{ file }">
            <div class="fileimg">
              <img class="el-upload-list__item-thumbnail" :src="file.url" />
            </div>

            <span class="el-upload-list__item-actions">
              <!-- <span
                class="el-upload-list__item-preview"
                @click="handlePictureCardPreview(file)"
              >
                <i class="el-icon-zoom-in"></i>
              </span> -->
              <span
                v-if="!disabled"
                class="el-upload-list__item-delete"
                @click="handleRemovesXJ(file)"
              >
                <i class="el-icon-delete"></i>
              </span>
            </span>
          </div>
        </el-upload>
      </div>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取 消</el-button>
      <el-button
        type="primary"
        @click="onEdit"
        :disabled="!editForm.pay_pricing_number"
        >确 定</el-button
      >
    </span>
  </el-dialog>
    <el-dialog :visible.sync="dialogVisibleImage" :modal="false">
      <img width="100%" :src="dialogImageUrl" alt="" />
    </el-dialog>
  </div>
  
</template>

<script>
import {
  postAdminPricingGetPricingGetPricingOrder,
  postAdminPricingGetPricingSetPricingExamine,
  postHomeCodeGetFactory,
} from "@/api";
import pagination from "@/components/pagination.vue";
export default {
  components: { pagination },
  props: {
    dialogVisible: {
      type: Boolean,
      default: false,
    },
    id: "",
    type_no: "",
    valuation_purpose: "",
    reason:"",
    images:[]
  },
  data() {
    return {
      dialogVisibleImage:false,
      dialogImageUrl:"",
      loading: false,
      isTrue: false, // 是否带参数
      factoryList: [],
      options: [
        {
          value: "",
          label: "全部",
        },
        {
          value: 0,
          label: "未审核",
        },
        {
          value: 1,
          label: "通过",
        },
        {
          value: 2,
          label: "拒绝",
        },
      ],
      form: {
        supplier_id: "",
        type_no: "",
        valuation_purpose: "实付核价",
        s_status: 1,
        page: 1,
        size: 10,
      },
      auditform: {
        status: 1,
      },
      tableData: [],
      total: 1,
      // 选中
      editForm: {
        id: "",
        pay_pricing_number: "",
        reason: "",
        images: [],
      },
    };
  },
  mounted() {
    let form = this.form;
    form.type_no = this.type_no;
    if (this.type_no) {
      this.postAdminPricingGetPricingGetPricingOrder(form);
    }
    this.postHomeCodeGetFactory();
  },
  watch: {
    type_no(val) {
      if (val) {
        let form = this.form;
        form.type_no = val;
        this.postAdminPricingGetPricingGetPricingOrder(form);
      }
    },
    id(val) {
      console.log("val", val);
      if (val) {
        this.editForm.id = val;
      }
    },
  },
  methods: {
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisibleImage = true;
    },
    handleSuccessXJ(response) {
      let { images } = this.editForm;
      let obj = {
        name: "图片",
        url: response.img,
      };
      images.push(obj);
      this.editForm.images = images;
    },
    handleRemovesXJ(file) {
      let { images } = this.editForm;
      let index = images.findIndex((e) => e.url == file.url);
      images.splice(index, 1);
      this.editForm.images = images;
      return true;
    },
    handleClose() {
      this.editForm = {
        id: "",
        pay_pricing_number: "",
        reason: "",
      };
      this.$emit("handleChangedialogVisible");
    },
    // 加工厂列表
    postHomeCodeGetFactory() {
      let obj = {
        page: 1,
        size: 1000,
      };
      postHomeCodeGetFactory(obj).then((res) => {
        this.factoryList = res.data;
      });
    },
    // 选中
    onEdit() {
      this.loading = true;
      let editForm = this.editForm;
      postAdminPricingGetPricingSetPricingExamine(editForm)
        .then((res) => {
          this.$message({
            type: "success",
            message: "调整成功!",
          });
          this.loading = false;
          this.$emit("onSearch");
          this.handleClose();
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    // 采购列表
    async postAdminPricingGetPricingGetPricingOrder(data) {
      this.loading = true;
      this.form = data;
      postAdminPricingGetPricingGetPricingOrder(data)
        .then((res) => {
          this.loading = false;
          console.log("采购列表", res);
          this.tableData = res.data;
          this.total = Number(res.total);
          this.editForm.reason = this.reason
          this.editForm.images = this.images
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    // 搜索
    onSearch() {
      this.form.page = 1;
      this.form.size = 10;
      this.postAdminPricingGetPricingGetPricingOrder(this.form);
    },
  },
};
</script>

<style lang="scss" scoped>
.myform {
  display: flex;
  justify-content: space-between;
  > div {
    display: flex;
  }
  &-item {
    margin-right: 10px;
  }
}
.WorkingSchedule {
  background: #ffff;
  padding: 20px;
  border-radius: 2px;
  @include boxShadow;
}
</style>
